import { HashRouter as Router, useRoutes } from 'react-router-dom';
// 导入路由规则
import routes from './router/routes';
// import RouterView from './router/RouterView';
import { Suspense } from 'react';
import './assets/css/common.scss';
import { Spin } from 'antd';

const RouterView = () => {
    // 使用useRoutes之后, 就不需要再使用Routes组件了
    /*
        [{path:'/home',element:<Home/>},{path:'/cate',element:<Cate/>}]
        =>
        <Routes>
            <Route path="/home" element={<Home/>}/>
            <Route path="/cate" element={<Cate/>}/>
        </Routes>
    */
    const element = useRoutes(routes);
    return element
}
export default function App() {
    const spinStyle = { 'position': 'fixed', top: '50%', left: '50%', transform: 'translate(-50%,-50%)' };
    return (
        <Router>
            <Suspense fallback={<Spin size="large" style={spinStyle} />}>
                <RouterView />
            </Suspense>
        </Router>
    )
}
